/**
 * Front End Shopping
 */

var shopping = {};
/*
 * Menu
 */
shopping.treeMenu = function(ulId, inId){
	var data = sedev.json_decode($('#'+inId).html());
	if(data.sedevError >= 0){
		var listItem = data.data;	
		var date = new Date();
		for(var index=0; index<listItem.length; ++index){
			var parentId = "menu"+ listItem[index].parentId + "_" + date.getTime();
			var itemId = "menu"+ listItem[index].id + "_" + date.getTime();
			var ulChildId = "submenu_" + parentId;
			var html= "";
			if(data.active == listItem[index].id){
				html += "<li class='shopping_menu_active' id='" + itemId + "'>";
			}else{
				html += "<li id='" + itemId + "'>";
			}		
			html += "<a href='"+ data.link + "=" + listItem[index].id +"'>";
			html += "<span>";
			html += listItem[index].name;
			html += "</span>";
			html += "</a>";
			html += "</li>";
			
			if (listItem[index].parentId == '0') {
				$('#' + ulId).append(html);
			} else {
				// tim parent id
				var $parentItem = $('#' + ulId).find('#' + parentId);
				var hasULChild = document.getElementById(ulChildId);
				if (hasULChild == null) {
					var ulChild = "<ul id='" + ulChildId + "'></ul>";
					$parentItem.append(ulChild);
				}
				// add child
				$parentItem.find('#' + ulChildId).append(html);
			}
		}
		if(data.manager && data.title){
			html = "<li>";
			html += "<a href='"+ data.manager +"'>";
			html += "<span>";
			html += data.title;
			html += "</span>";
			html += "</a>";
			html += "</li>";
			$('#' + ulId).append(html);
		}		
	}
	$('#'+inId).remove();
};

/*
 * Paging
 */
shopping.renderPagingGroup = function(divId, titlePre, titleNext) {
	var divTag = document.getElementById(divId);
	if(divTag == null){
		alert(divId + " is " + divTag);
		return;
	}
	var data = sedev.json_decode(divTag.innerHTML);
	divTag.innerHTML = "";
	if (data.totalRecord == '0'){
		return;
	}
	data.currentPage = parseInt(data.currentPage);
	data.pageSize = parseInt(data.pageSize);
	data.numDisplay = parseInt(data.numDisplay);
	
    var totalpage = parseInt(data.totalRecord / data.pageSize);
    if (data.totalRecord % data.pageSize > 0)
        totalpage += 1;
    if(data.currentPage < 0 )
    	data.currentPage = 1;
    if (data.currentPage > totalpage)
    	data.currentPage = totalpage;    
    
    var paging = "", next = "", pre = "";
    var pos_start, pos_end;
    
    url = data.action + "&shopping_search_page=";
    if (data.numDisplay >= totalpage) {
        pos_start = 1;
        pos_end = totalpage;
    }else{
        var half = parseInt(data.numDisplay / 2);
        if (data.currentPage <= half) {
            pos_start = 1;
        }else {
            if (data.currentPage + half > totalpage) {
                pos_start = totalpage - numdisplay + 1;
            } else {
                pos_start = data.currentPage - half + 1;
            }
        }
        pos_end = numdisplay;
    }
    if ((data.currentPage - 1) > 0) {
        pre = "<a href='" + url + (data.currentPage - 1) + "' style='cursor: pointer; color: rgb(0, 102, 204);' class='pre' >Trước</a>";
        pre = pre + "&nbsp;";
    } else {
        pre = "<a class='pre' >"+ titlePre +"</a>";
        pre = pre + "&nbsp;";
    }    
    if ((data.currentPage + 1) <= totalpage) {
        next = "<a href='" + url + (data.currentPage + 1) + "' style='cursor: pointer; color: rgb(0, 102, 204);' class='next' >Sau</a>";
        next = "&nbsp;" + next;
    } else {
        next = "<a class='next' >"+ titleNext +"</a>";
        next = "&nbsp;" + next;
    }
    for (var i = 0; i < pos_end; i++) {
        if (i != 0) {
            paging += "&nbsp;-&nbsp;";
        }
        if (pos_start == data.currentPage) {
            paging += "<span class='current'><a>" + pos_start + "</a></span>";
        }else {
            paging += "<a href='" + url + pos_start + "' class='page' style='cursor: pointer; color: rgb(0, 102, 204);' >" + pos_start + "</a>";
        }
        pos_start++;
    }

    paging = pre + paging + next;
    divTag.innerHTML = paging;
    $("#"+divId).css("display","block");
};
shopping.renderPagingSearch = function(divId, titlePre, titleNext, keyword) {
	var divTag = document.getElementById(divId);
	if(divTag == null){
		alert(divId + " is " + divTag);
		return;
	}
	var data = sedev.json_decode(divTag.innerHTML);
	divTag.innerHTML = "";
	if (data.totalRecord == '0'){
		return;
	}
	data.currentPage = parseInt(data.currentPage);
	data.pageSize = parseInt(data.pageSize);
	data.numDisplay = parseInt(data.numDisplay);
	
    var totalpage = parseInt(data.totalRecord / data.pageSize);
    if (data.totalRecord % data.pageSize > 0)
        totalpage += 1;
    if(data.currentPage < 0 )
    	data.currentPage = 1;
    if (data.currentPage > totalpage)
    	data.currentPage = totalpage;    
    
    var paging = "", next = "", pre = "";
    var pos_start, pos_end;
    
    url = data.action + "&keyword="+ keyword + "&shopping_search_page=";
    if (data.numDisplay >= totalpage) {
        pos_start = 1;
        pos_end = totalpage;
    }else{
        var half = parseInt(data.numDisplay / 2);
        if (data.currentPage <= half) {
            pos_start = 1;
        }else {
            if (data.currentPage + half > totalpage) {
                pos_start = totalpage - numdisplay + 1;
            } else {
                pos_start = data.currentPage - half + 1;
            }
        }
        pos_end = numdisplay;
    }
    if ((data.currentPage - 1) > 0) {
        pre = "<a href='" + url + (data.currentPage - 1) + "' style='cursor: pointer; color: rgb(0, 102, 204);' class='pre' >Trước</a>";
        pre = pre + "&nbsp;";
    } else {
        pre = "<a class='pre' >"+ titlePre +"</a>";
        pre = pre + "&nbsp;";
    }    
    if ((data.currentPage + 1) <= totalpage) {
        next = "<a href='" + url + (data.currentPage + 1) + "' style='cursor: pointer; color: rgb(0, 102, 204);' class='next' >Sau</a>";
        next = "&nbsp;" + next;
    } else {
        next = "<a class='next' >"+ titleNext +"</a>";
        next = "&nbsp;" + next;
    }
    for (var i = 0; i < pos_end; i++) {
        if (i != 0) {
            paging += "&nbsp;-&nbsp;";
        }
        if (pos_start == data.currentPage) {
            paging += "<strong class='current'>" + pos_start + "</strong>";
        }else {
            paging += "<a href='" + url + pos_start + "' class='page' style='cursor: pointer; color: rgb(0, 102, 204);' >" + pos_start + "</a>";
        }
        pos_start++;
    }

    paging = pre + paging + next;
    divTag.innerHTML = paging;
    $("#"+divId).css("display","block");
};
/*
 * Image
 */
shopping.appendThumbnail = function(outId, inId){
	var data = sedev.json_decode($('#'+inId).html());
	var listImage = data.large;
	var link= "";
	if(listImage.length > 0){
		link = listImage[0].link;
	}
	var image= "<img class='shopping_thubnail' src='" + link + "' />";
	$('#'+outId).append(image);
	$('#'+inId).remove();
};

shopping.appendImagesProduct = function(ulId, inId, mainPicId){
	var data = sedev.json_decode($('#'+inId).html());
	var listImage = data.large;
	var images = '';
	var link= '';
	for( var index=0; index < listImage.length; ++index){
		link = listImage[index].link;
		images += "<li style='display: list-item;'>" ;
		images += "<a style='cursor: pointer;'>";
		images += "<img class='shopping_image_detail' src='" + link + "' />";
		images += "</a>";
		images += "</li>" ;
	}
	$('#'+ulId).append(images);
	$('#'+inId).remove();
	
	if(listImage.length > 0){
		link = listImage[0].link;
		images = "<a class='thumb_big'>";
		images += "<img height='300' width='244' id='main_img' src='" + link + "' />";
		images += "</a>";	
		$('#'+mainPicId).html(images);
	}
	
	shopping.setupWrapImage(ulId, mainPicId);
};

shopping.setupWrapImage = function(ulId, mainPicId){
	var root = document.getElementById(ulId);
	if(root){
		var listItem = root.getElementsByTagName("li");
		for(var index=0; index < listItem.length; ++index){
			listItem[index].setAttribute('rev', mainPicId);
			listItem[index].onclick = function(){
				shopping.wrapImage(this,this.getAttribute('rev'));
			};
		}		
	}
};

shopping.wrapImage = function (obj, outId){
	var items = obj.getElementsByTagName("a");
	if(items.length > 0){
		var images = items[0].getElementsByTagName("img");
		if(images.length > 0){
			var src = images[0].getAttribute('src');
			var des = document.getElementById(outId);
			if(des){
				items = des.getElementsByTagName("a");
				if(items.length > 0){
					images = items[0].getElementsByTagName("img");
					if(images.length > 0){
						 images[0].setAttribute('src', src);
					}
				}				
			}
		}    
	}
};
/*
 * Attribute
 */
shopping.showAttributeProduct = function(displayId){
	var divObj = new Object();
	var divInsert = "";
	if ($('#' + displayId).html()!='') {		
		divObj = sedev.json_decode($('#' + displayId).html());
		var data = divObj.data;		
		for ( var index=0; index<data.length; ++index) {
			for(var item in data[index]){
				divInsert += "<p>";
				divInsert += "<span>" + item + " : " + "</span>";
				divInsert += "<span>" +data[index][item] + "</span>";
				divInsert += "</p";
			}			
		}		
	}
	$('#' + displayId).html(divInsert);
	$('#' + displayId).css("display", "block");
};
